<template>
  <div class="login-padding">
    <div class="login-lay">
      <img src="../assets/img/logo.jpg" style="width: 150px;">
    </div>

    <Card class="login-content">
      <div slot="content">
        <x-input v-model="user" placeholder="请输入用户名"></x-input>
        <x-input v-model="password" type="password" placeholder="请输入密码"></x-input>
      </div>
    </Card>

    <div class="login-paw">
      <check-icon :value.sync="remember"></check-icon>
      记住密码
    </div>

    <x-button type="primary" action-type="button" @click.native="handleSubmit">登录</x-button>

    <div class="lng-flex lng-jc-sb">
      <div class="color">
        <router-link to="register">立即注册</router-link>
      </div>
      <div class="color">
        <router-link to="forgetPassword">忘记密码</router-link>
      </div>

    </div>


  </div>

</template>
<style scoped>
  .lng-flex{
    margin-top: 10px;
  }
  .login-padding{
    padding: 10px 15px;
    width: calc(100% - 30px);
  }
  .login-lay {
    margin-top: 60px;
    margin-bottom: 30px;
    text-align: center;
  }

  .login-content {
    margin-bottom: 10px;
  }

  .login-paw {
    margin-bottom: 10px;
  }


  .color {
    color: #2d8cf0 !important;
  }
</style>

<script>
  import {
    XInput,
    Card,
    CheckIcon,
    XButton
  } from 'vux'
  import util from '@/fetch/util';


  export default {
    components: {
      XInput,
      Card,
      CheckIcon,
      XButton
    },
    data () {
      return {
        user: '',
        password: '',
        remember: true,
        userInfo: null,
      }
    },
    methods: {
      wxLogin(){
        if (!this.user) {
          this.$vux.toast.text('请输入用户名');
          return false;
        }
        if (!this.password) {
          this.$vux.toast.text('请输入密码');
          return false;
        }
        let params = {
          username: this.user,
          password: this.password,
          rememberMe: this.remember,
          openid: this.userInfo.openid,
        };
        this.$vux.loading.show({
          text: '登录中'
        });
        util.fetchPost(util.path.wxReg, params).then((data) => {
          this.$vux.loading.hide();
          //控制加载条
          if (data) {

            localStorage.setItem("lng-token", data.data.token);
            this.goToMap();
          }

        }).catch(err => {
          this.$vux.loading.hide();
          this.$vux.toast.text(err.message)
        })
      },
      login(){
        if (!this.user) {
          this.$vux.toast.text('请输入用户名');
          return false;
        }
        if (!this.password) {
          this.$vux.toast.text('请输入密码');
          return false;
        }
        let params = {
          username: this.user,
          password: this.password,
          rememberMe: this.remember,
        };
        this.$vux.loading.show({
          text: '登录中'
        });
        util.fetchPost(util.path.login, params).then((data) => {
          this.$vux.loading.hide();
          //控制加载条
          if (data) {

            localStorage.setItem("lng-token", data.data.token);

            this.goToMap();
          }

        }).catch(err => {
          this.$vux.loading.hide();
          this.$vux.toast.text(err.message)
        })
      },
      handleSubmit(){
        let $this = this;
//        if (util.isWeiXin()) {
//          $this.wxLogin();
//        } else {
//          $this.login();
//        }
        $this.login();

      },
      goToMap(){
        this.$vux.toast.text('登录成功...');

        setTimeout(() => {

          let redirect = this.$route.query.redirect;
          // redirect - token 验证失败传入
          if (redirect && redirect !='login') {
            this.$router.push({name: redirect})
          } else {
            this.$router.push({
              name: 'amap'
            });
          }
        }, 1500);
      }
    },
    mounted(){
      let $this = this;
      $this.userInfo = JSON.parse(localStorage.getItem("lng-user"));
      console.log($this.userInfo)
      console.log($this.$route)
    }
  }
</script>
